/** Add css rules here for your application. */


/** Example rules used by the template application (remove for your app) */


#body {
	background-color:#CCFFE6;
}

.hide {
	display:none;
}

.show {
	display:block;
}

.popup {
	padding:0px 5 5 5;
}

.dialogVPAnel {
	
}

.tabela-header {
	font-weight:bold;
}

.label {
	text-align:center;
	font-weight:bold;
	font-size:15px;
	color:gray;
}

.closeButton {
	border:1px solid black;
	background-color:#D9D9D9;	
}

h1 {
  font-size: 2em;
  font-weight: bold;
  color: #00A352;//#777777;
  margin: 40px 0px 70px;
  text-align: center;
}

#login h2 {
	text-align:center;
	font:Arial, Helvetica, sans-serif;
	font-size:14px;
}

#painel-atributos {
	text-align:center;
	font-size:14px;
}

.atributo-nome, .atributo-valor {
	display:inline;
}

.atributo-nome {
	color:blue;
	font-weight:bold;
}

.atributo-valor {
	clear:right;
	color:red;
	font-weight:bold;
	padding-right:100px;
}



#menu {
	float:left;
}

#menu ul {
	margin:0px;
	padding:0px;
}

#menu ul li {
	margin-bottom:5px;
	list-style-type:none;
}

#menu ul li button {
	border:2px solid black;
}

#menu ul li button:hover {
	background:#CCCCCC; !important
}

#menu ul li button:active {
	border:2px solid red;
	background:#CCCCCC; !important
}

#menu ul li .button-visited {
	
    border-radius: 3px 3px 3px 3px;
    padding: 5px 7px;
    
	background:#CCCCCC;  
	border-color:red; !important;
	color:red; !important;
}

#zoo-grid {
	height:760px;
	width:760px;
	margin:auto;
	border:7px groove black;
}

.animal-container, .animal-container-hover, .animal-container-clicked, .animal-container-clicked-1, .animal-container-clicked-2,
.animal-container-clicked-3, .animal-container-clicked-4, .animal-container-clicked-5 {
	height:150px;
	width:150px;
	float:left;
} 

.animal-container  {
	border:1px dashed green;
	background:#FFFF99;
}

.nome-habitat {
	display:inline;
	padding:auto;
	margin:auto;
	font-size:20px; !important;
	font-weight:900;
	//text-align:center;
}

.animal-container-hover {
	border:1px solid black;
	background-color:#E495CA;
}

.animal-container-clicked-1 {
	border:1px solid black;
	background-color:#7ACAFF;
}

.animal-container-clicked-2 {
	border:1px solid black;
	background-color:#33FF66;
}

.animal-container-clicked-3 {
	border:1px solid black;
	background-color:#99CC66;
}

.animal-container-clicked-4 {
	border:1px solid black;
	background-color:#CC9999;
}

.animal-container-clicked-5 {
	border:1px solid black;
	background-color:#9999CC;
}